
@media only screen and (max-device-width: 1024px) and (orientation:portrait) { 
    #thumbnail {
        height: 240px;
        width: 320px;
    }
}


@media  only screen and (max-device-width: 1024px) and (orientation:landscape) { 
    #thumbnail {
        height: 360px;
        width: 480px;
    }
}

#root {
    /**
    background-image: linear-gradient(bottom, rgb(47,156,214) 46%, rgb(104,195,240) 73%);
    background-image: -o-linear-gradient(bottom, rgb(47,156,214) 46%, rgb(104,195,240) 73%);
    background-image: -moz-linear-gradient(bottom, rgb(47,156,214) 46%, rgb(104,195,240) 73%);
    background-image: -webkit-linear-gradient(bottom, rgb(47,156,214) 46%, rgb(104,195,240) 73%);
    background-image: -ms-linear-gradient(bottom, rgb(47,156,214) 46%, rgb(104,195,240) 73%);

    background-image: -webkit-gradient(
        linear,
        left bottom,
        left top,
        color-stop(0.46, rgb(47,156,214)),
        color-stop(0.73, rgb(104,195,240))
        );
     **/

    background-image: initial;
    background-repeat-x: initial;
    background-repeat-y: initial;
    background-attachment: initial;
    background-position-x: initial;
    background-position-y: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: #131925;
    font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
    font-size: 12px;
    line-height: 1.4em;
    color: #000000;
    text-align: center;
}

#header {
    /**
        background: #ffffff;
        margin: 5px;
        border: 1px solid #101010;
        padding: 0px 0px 0px 7px;
        text-align: left;
        -moz-border-radius: 8px;
        -webkit-border-radius: 8px;
        -webkit-box-shadow: 0 2px 20px #131315;
        -moz-box-shadow: 0 2px 20px #131315;
        border-image: initial;
    **/
}

#headerText {
    font-family: 'Concert One', cursive Arial, serif; 
    font-size: 32px;
    color: #ffffff;
    text-align: left;
    padding:10px;
    text-shadow: 0px -1px 0px #374683;
}

#left-content, #top-right-content, #bottom-right-content {
    /**background: #ffffff;**/

    background-image: initial;
    background-repeat-x: initial;
    background-repeat-y: initial;
    background-attachment: initial;
    background-position-x: initial;
    background-position-y: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: #F2F2F2;

    margin: 2px;
    border: 1px solid #101010;
    padding: 2px 2px 2px 2px;
    text-align: left;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -webkit-box-shadow: 0 2px 20px #131315;
    -moz-box-shadow: 0 2px 20px #131315;
    border-image: initial;
}

#right-view-content img {
    width: 120px;
    height: 90px;
}

#multiview-news {
}

#multiview-video {
}

#videoContainer {
    margin-top: 20px;
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 10px;
    color:#000000;
    text-align: center;    
}

#thumbnail-gallery {
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: #282828;
    border-right-color: #282828;
    border-bottom-color: #282828;
    border-left-color: #282828;
}

#keyArtImage {
    padding: 15px 5px 5px 5px;
}

#keyArtInfo {
    padding: 5px 5px 5px 5px;

}

#thumbnail {
    width: 320px;
    height: 240px;	
}

#btn-prev, #btn-next {
    width: 27px;
    height: 70px;
}

#gallery-content {
    text-align: center;
    width: 360px;
}
#gallery-content div{
    text-align: justify;
    margin: 20px;
}

#footer {
    /**background: #ffffff;**/
    background: #F2F2F2;
    background-image: initial;
    background-repeat-x: initial;
    background-repeat-y: initial;
    background-attachment: initial;
    background-position-x: initial;
    background-position-y: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: #F2F2F2;
    margin: 2px;
    border: 1px solid #101010;
    padding: 0px 0px 0px 7px;
    text-align: left;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -webkit-box-shadow: 0 2px 20px #131315;
    -moz-box-shadow: 0 2px 20px #131315;
    border-image: initial;
}

.button {
    color: #ffffff;
    padding: 6px 15px;
    background: -moz-linear-gradient(top, #479bdf 0%, #479bdf);
    background: -webkit-gradient(linear, left top, left bottom, from(#479bdf),
        to(#479bdf) );
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border: 3px solid #ffffff;
    -moz-box-shadow: 0px 3px 11px rgba(000, 000, 000, 0.5), inset 0px 0px
        1px rgba(000, 085, 255, 1);
    -webkit-box-shadow: 0px 3px 11px rgba(000, 000, 000, 0.5), inset 0px 0px
        1px rgba(000, 085, 255, 1);
    text-shadow: 0px -1px 0px rgba(000, 000, 000, 0.2), 0px 1px 0px
        rgba(255, 255, 255, 0.3);
    text-align: center;		
    width:20%;		
}

.popup-closebutton {
    padding: 4px;
    border-radius: 8px;
    text-align: center;
    color: #FFFFFF;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #D73F25),
        color-stop(1, #B11800) );
}

.popup-background {
    background-color: black;
}

.popup-content {
    color: navy;
    background-color: #EEE;
}

ul#navigation {
    height: 32px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}

ul#navigation li {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    float: left;
    width: 168px;
    margin: 0 10px 0 0;
    background-color: #2B477D;
    border: solid 1px #415F9D;
    position: relative;
    z-index: 1;
    list-style-type: none;
}

ul#navigation li.selected {
    z-index: 3;
}

ul#navigation li.shadow {
    width: 100%;
    height: 2px;
    position: absolute;
    bottom: -3px;
    left: 0;
    border: none;
    background: none;
    z-index: 2;
    -webkit-box-shadow: #111 0 -2px 6px;
    -moz-box-shadow: #111 0 -2px 6px;
    box-shadow: #111 0 -2px 6px;
}

ul#navigation li a:link, ul#navigation li a:visited {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    display: block;
    text-align: center;
    width: 168px;
    height: 40px;
    line-height: 36px;
    font-family: Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    letter-spacing: 1px;
    outline: none;
    float: left;
    background: #2B477D;
    -webkit-transition: background-color 0.3s linear;
    -moz-transition: background-color 0.3s linear;
    -o-transition: background-color 0.3s linear;
}

ul#navigation li a:hover {
    background-color: #5a87dd;
}

ul#navigation li.selected a:link, ul#navigation li.selected a:visited {
    color: #2B477D;
    border: solid 1px #fff;
    -webkit-transition: background-color 0.2s linear;
    background: -moz-linear-gradient(top center, #d1d1d1, #f2f2f2 80%) repeat scroll 0 0 #f2f2f2;
    background: -webkit-gradient(linear,left bottom,left top,color-stop(.2, #f2f2f2),color-stop(.8, #d1d1d1));
    background-color: #f2f2f2;
}
